<template>
	<div style="padding-left: 1.25rem;padding-right: 1.25rem;padding-top: 50px;">
		<!-- 座位人数筛选 -->
		<br />
		<el-row :gutter="20">
			<el-col :span="18" >
				<div class="divCss">
					<el-card shadow="never">
						<el-row>
							<el-col :span="14">
								<el-radio-group @change="querySeatById('noClick', 0)" v-model="seatNum">
									<el-radio label="0">全部&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
								</el-radio-group>
								<el-radio-group @change="querySeatById('noClick', 0)" v-for="item in seatNumList" :key="item.seatNum" v-model="seatNum">
									<el-radio :label="item.seatNum">{{ item.seatNum }}人桌&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;</el-radio>
								</el-radio-group>
							</el-col>
							<el-col :span="10">
								<el-radio-group @change="querySeatById('noClick', 0)" v-model="deskStatus">
									<el-row :gutter="20">
										<el-col :span="4">
											<el-radio label="0"><span style="color: #263238;">全部</span></el-radio>
										</el-col>
										<el-col :span="4">
											<el-radio label="1"><span :style='"color:"+deskFormat.freeColor'>空闲</span></el-radio>
										</el-col>
										<el-col :span="4">
											<el-radio label="2"><span :style='"color:"+deskFormat.eatColor'>就餐</span></el-radio>
										</el-col>
										<el-col :span="4">
											<el-radio label="3"><span :style='"color:"+deskFormat.waitColor'>待清</span></el-radio>
										</el-col>
                    <el-col :span="4">
                      <el-radio label="5"><span :style='"color:"+deskFormat.preColor'>预结</span></el-radio>
                    </el-col>
										<el-col :span="4">
											<el-radio label="4"><span style="color: #aaaa7f;">锁台</span></el-radio>
										</el-col>
										<!-- <el-col :span="4"><el-radio label="5"><span style="color: #aaaa7f;">预定</span></el-radio></el-col> -->
									</el-row>
								</el-radio-group>
							</el-col>
						</el-row>
						<br />
						<br />
						<el-tabs type="card" v-model="activeStoreType" @tab-click="querySeatByStoreTypeId">
							<el-tab-pane v-for="i in storeTypeList" :key="i.id" :label="i.storeTypeName" :name="i.id">
								<el-tabs type="card" v-model="activeName" @tab-click="querySeatById">
									<el-tab-pane label="全部" name="0">
										<el-row :gutter="5" style="height: 32rem;overflow: auto;">
											<el-col :span="lineTableNum" v-for="item in dinningTableList" :key="item.id" style="padding-bottom: 5px;">
												<a style="cursor: pointer;text-decoration: none;" @dblclick="dbClickEvent(item)" @click="selectDiningTable(item)">
													<div :shadow="shadow" :style="'border-radius: 0rem;height:100px;background-color:' + item.style">
														<div style="padding-top: 1.475rem;color: #000000;">
															<div style="float: left;margin-left: 1rem;" v-if="item.status === 4">
																<svg
																	t="1617259214551"
																	class="icon"
																	viewBox="0 0 1024 1024"
																	version="1.1"
																	xmlns="http://www.w3.org/2000/svg"
																	p-id="1772"
																	width="24"
																	height="24"
																>
																	<path
																		d="M779.1 406.9h-74.6v-78.4h-0.1c-1.1-93.5-77.5-169.2-171.2-169.2S363 235 361.9 328.5h-0.1v78.4h-74.3l-20.6 20.6v392.1l20.6 20.6h491.2l20.6-20.6V427.2c-7.9-7.9-12.3-12.4-20.2-20.3z m-376-76.4c0-71.7 58.3-130 130-130s130 58.3 130 130v76.4h-260v-76.4z m355 468.5H308.2V448.2h449.9V799z"
																		fill="#1E88E5"
																		p-id="1773"
																	></path>
																	<path
																		d="M555.9 594.5v-84.4h-45.4v81.2c-26.3 8-45.4 32.3-45.4 61.2 0 35.3 28.6 64 64 64 35.3 0 64-28.6 64-64-0.1-25.8-15.3-47.9-37.2-58z"
																		fill="#1E88E5"
																		p-id="1774"
																	></path>
																</svg>
															</div>
															<div style="float: left;color: white;margin-left: 1rem;" v-show="item.master">并</div>
															<div style="float: right;margin-right: 1rem;" v-if="item.selectDeskId === 1">
																<svg
																	t="1617026871016"
																	class="icon"
																	viewBox="0 0 1024 1024"
																	version="1.1"
																	xmlns="http://www.w3.org/2000/svg"
																	p-id="9133"
																	width="24"
																	height="24"
																>
																	<path
																		d="M511 960c-60.5 0-119.1-11.8-174.4-35.2-53.4-22.6-101.3-54.9-142.4-96-41.1-41.1-73.4-89-96-142.4C74.8 631.1 63 572.5 63 512s11.8-119.1 35.2-174.4c22.6-53.4 54.9-101.3 96-142.4 41.1-41.1 89-73.4 142.4-96C391.9 75.8 450.5 64 511 64s119.1 11.8 174.4 35.2c53.4 22.6 101.3 54.9 142.4 96 41.1 41.1 73.4 89 96 142.4C947.2 392.9 959 451.5 959 512s-11.8 119.1-35.2 174.4c-22.6 53.4-54.9 101.3-96 142.4-41.1 41.1-89 73.4-142.4 96C630.1 948.2 571.5 960 511 960z m0-832c-211.7 0-384 172.3-384 384s172.3 384 384 384 384-172.3 384-384-172.3-384-384-384z"
																		fill="#3688FF"
																		p-id="9134"
																	></path>
																	<path
																		d="M473 704h-0.2c-8.8-0.1-17.2-3.7-23.2-10.1l-170-181.8c-12.1-12.9-11.4-33.2 1.5-45.2 12.9-12.1 33.2-11.4 45.2 1.5l147 157.1 222.6-231.7c12.2-12.7 32.5-13.1 45.2-0.9 12.7 12.2 13.1 32.5 0.9 45.2l-246 256c-5.9 6.4-14.3 9.9-23 9.9z"
																		fill="#3688FF"
																		p-id="9135"
																	></path>
																</svg>
															</div>
															<div style="float: right;margin-right: 1rem;" v-if="item.mergeDeskId === 1 && item.masterId === mergeDeskID">
																<svg
																	t="1617030756833"
																	class="icon"
																	viewBox="0 0 1024 1024"
																	version="1.1"
																	xmlns="http://www.w3.org/2000/svg"
																	p-id="13867"
																	width="24"
																	height="24"
																>
																	<path
																		d="M512 929.959184c-230.4 0-417.959184-187.559184-417.959184-417.959184s187.559184-417.959184 417.959184-417.959184 417.959184 187.559184 417.959184 417.959184-187.559184 417.959184-417.959184 417.959184z"
																		fill="#16C4AF"
																		p-id="13868"
																	></path>
																	<path
																		d="M459.755102 637.387755c-5.22449 0-10.44898-2.089796-14.628571-6.269388l-104.489796-104.489796c-8.359184-8.359184-8.359184-21.420408 0-29.779591 8.359184-8.359184 21.420408-8.359184 29.779592 0l104.489795 104.489796c8.359184 8.359184 8.359184 21.420408 0 29.779591-4.702041 4.179592-9.926531 6.269388-15.15102 6.269388z"
																		fill="#DCFFFA"
																		p-id="13869"
																	></path>
																	<path
																		d="M459.755102 637.387755c-5.22449 0-10.44898-2.089796-14.628571-6.269388-8.359184-8.359184-8.359184-21.420408 0-29.779591l208.979591-208.979592c8.359184-8.359184 21.420408-8.359184 29.779592 0 8.359184 8.359184 8.359184 21.420408 0 29.779592l-208.979592 208.979591c-4.702041 4.179592-9.926531 6.269388-15.15102 6.269388z"
																		fill="#DCFFFA"
																		p-id="13870"
																	></path>
																</svg>
															</div>
														</div>
														<div style="float: left;color: springgreen;margin-left: 1rem;" v-show="item.slave">子</div>
														<div class="tableName" style="color: #000000;">{{ item.diningTableNo }}</div>
														<br />
														<div v-show="item.status === 1" class="seatNum1" style="color: #000000;">{{ item.seatNum }}人桌</div>
														<div v-show="item.status === 4" class="seatNum1" style="color: #000000;">{{ item.seatNum }}人桌</div>
														<div v-show="item.status === 5" class="seatNum1" style="color: white;">预结</div>
														<div v-show="item.status === 3" class="seatNum1" style="color: white;">待清</div>
                            <div v-show="item.status === 6" class="seatNum1" style="color: white;">停用</div>
														<div v-if="item.status === 2">
															<div style="float: left;margin-left: 1.05rem;">￥{{ item.money }}</div>
															<div style="float: right;margin-right:  1.05rem;">{{ formatMsgTime(new Date(item.time).getTime()) }}</div>
														</div>
														<br />
													</div>
												</a>
												<!-- <br /> -->
											</el-col>
										</el-row>
									</el-tab-pane>
									<el-tab-pane v-for="items in regionList" :key="items.id" :label="items.regionName" :name="items.id">
										<el-row :gutter="5">
											<el-col :span="lineTableNum" v-for="items in dinningTableList" :key="items.id" style="padding-bottom: 5px;">
																<a style="cursor: pointer;text-decoration: none;" @dblclick="dbClickEvent(items)" @click="selectDiningTable(items)">
																	<div :shadow="shadow" :style="'border-radius: 0rem;height:100px;background-color:' + items.style">
																		<div style="padding-top: 1.475rem;color: #000000;">
																			<div style="float: left;margin-left: 1rem;" v-if="items.status === 4">
																				<svg
																					t="1617259214551"
																					class="icon"
																					viewBox="0 0 1024 1024"
																					version="1.1"
																					xmlns="http://www.w3.org/2000/svg"
																					p-id="1772"
																					width="24"
																					height="24"
																				>
																					<path
																						d="M779.1 406.9h-74.6v-78.4h-0.1c-1.1-93.5-77.5-169.2-171.2-169.2S363 235 361.9 328.5h-0.1v78.4h-74.3l-20.6 20.6v392.1l20.6 20.6h491.2l20.6-20.6V427.2c-7.9-7.9-12.3-12.4-20.2-20.3z m-376-76.4c0-71.7 58.3-130 130-130s130 58.3 130 130v76.4h-260v-76.4z m355 468.5H308.2V448.2h449.9V799z"
																						fill="#1E88E5"
																						p-id="1773"
																					></path>
																					<path
																						d="M555.9 594.5v-84.4h-45.4v81.2c-26.3 8-45.4 32.3-45.4 61.2 0 35.3 28.6 64 64 64 35.3 0 64-28.6 64-64-0.1-25.8-15.3-47.9-37.2-58z"
																						fill="#1E88E5"
																						p-id="1774"
																					></path>
																				</svg>
																			</div>
																			<div style="float: left;color: white;margin-left: 1rem;" v-show="items.master">并</div>
																			<div style="float: right;margin-right: 1rem;" v-if="items.selectDeskId === 1">
																				<svg
																					t="1617026871016"
																					class="icon"
																					viewBox="0 0 1024 1024"
																					version="1.1"
																					xmlns="http://www.w3.org/2000/svg"
																					p-id="9133"
																					width="24"
																					height="24"
																				>
																					<path
																						d="M511 960c-60.5 0-119.1-11.8-174.4-35.2-53.4-22.6-101.3-54.9-142.4-96-41.1-41.1-73.4-89-96-142.4C74.8 631.1 63 572.5 63 512s11.8-119.1 35.2-174.4c22.6-53.4 54.9-101.3 96-142.4 41.1-41.1 89-73.4 142.4-96C391.9 75.8 450.5 64 511 64s119.1 11.8 174.4 35.2c53.4 22.6 101.3 54.9 142.4 96 41.1 41.1 73.4 89 96 142.4C947.2 392.9 959 451.5 959 512s-11.8 119.1-35.2 174.4c-22.6 53.4-54.9 101.3-96 142.4-41.1 41.1-89 73.4-142.4 96C630.1 948.2 571.5 960 511 960z m0-832c-211.7 0-384 172.3-384 384s172.3 384 384 384 384-172.3 384-384-172.3-384-384-384z"
																						fill="#3688FF"
																						p-id="9134"
																					></path>
																					<path
																						d="M473 704h-0.2c-8.8-0.1-17.2-3.7-23.2-10.1l-170-181.8c-12.1-12.9-11.4-33.2 1.5-45.2 12.9-12.1 33.2-11.4 45.2 1.5l147 157.1 222.6-231.7c12.2-12.7 32.5-13.1 45.2-0.9 12.7 12.2 13.1 32.5 0.9 45.2l-246 256c-5.9 6.4-14.3 9.9-23 9.9z"
																						fill="#3688FF"
																						p-id="9135"
																					></path>
																				</svg>
																			</div>
																			<div style="float: right;margin-right: 1rem;" v-if="items.mergeDeskId === 1 && items.masterId === mergeDeskID">
																				<svg
																					t="1617030756833"
																					class="icon"
																					viewBox="0 0 1024 1024"
																					version="1.1"
																					xmlns="http://www.w3.org/2000/svg"
																					p-id="13867"
																					width="24"
																					height="24"
																				>
																					<path
																						d="M512 929.959184c-230.4 0-417.959184-187.559184-417.959184-417.959184s187.559184-417.959184 417.959184-417.959184 417.959184 187.559184 417.959184 417.959184-187.559184 417.959184-417.959184 417.959184z"
																						fill="#16C4AF"
																						p-id="13868"
																					></path>
																					<path
																						d="M459.755102 637.387755c-5.22449 0-10.44898-2.089796-14.628571-6.269388l-104.489796-104.489796c-8.359184-8.359184-8.359184-21.420408 0-29.779591 8.359184-8.359184 21.420408-8.359184 29.779592 0l104.489795 104.489796c8.359184 8.359184 8.359184 21.420408 0 29.779591-4.702041 4.179592-9.926531 6.269388-15.15102 6.269388z"
																						fill="#DCFFFA"
																						p-id="13869"
																					></path>
																					<path
																						d="M459.755102 637.387755c-5.22449 0-10.44898-2.089796-14.628571-6.269388-8.359184-8.359184-8.359184-21.420408 0-29.779591l208.979591-208.979592c8.359184-8.359184 21.420408-8.359184 29.779592 0 8.359184 8.359184 8.359184 21.420408 0 29.779592l-208.979592 208.979591c-4.702041 4.179592-9.926531 6.269388-15.15102 6.269388z"
																						fill="#DCFFFA"
																						p-id="13870"
																					></path>
																				</svg>
																			</div>
																		</div>
																		<div style="float: left;color: springgreen;margin-left: 1rem;" v-show="items.slave">子</div>
																		<div class="tableName" style="color: #000000;">{{ items.diningTableNo }}</div>
																		<br />
																		<div v-show="items.status === 1" class="seatNum1" style="color: #000000;">{{ items.seatNum }}人桌</div>
																		<div v-show="items.status === 4" class="seatNum1" style="color: #000000;">{{ items.seatNum }}人桌</div>
																		<div v-show="items.status === 5" class="seatNum1" style="color: white;">预结</div>
																		<div v-show="items.status === 3" class="seatNum1" style="color: white;">待清</div>
											<div v-show="items.status === 6" class="seatNum1" style="color: white;">停用</div>
																		<div v-if="items.status === 2">
																			<div style="float: left;margin-left: 1.05rem;">￥{{ items.money }}</div>
																			<div style="float: right;margin-right:  1.05rem;">{{ formatMsgTime(new Date(items.time).getTime()) }}</div>
																		</div>
																		<br />
																	</div>
																</a>
																<!-- <br /> -->
															</el-col>
										</el-row>
									</el-tab-pane>
								</el-tabs>
							</el-tab-pane>
<!--							<el-pagination-->
<!--								style="text-align: center;"-->
<!--								background-->
<!--								@size-change="sizeChangeHandle"-->
<!--								@current-change="currentChangeHandle"-->
<!--								:current-page="pageIndex"-->
<!--								:page-sizes="32"-->
<!--								:page-size="pageSize"-->
<!--								:total="totalPage"-->
<!--								layout="prev, next"-->
<!--							></el-pagination>-->
						</el-tabs>
					</el-card>
				</div>
			</el-col>
			<el-drawer
			  title="我是标题"
			  :visible.sync="drawer"
			  :with-header="false">
			  <el-col :span="6" >
			  	<div>
			  		<el-card shadow="never">
			  			<el-row :gutter="30">
			  				<el-col :span="12">桌号:&nbsp;{{ orderInfo.diningTableNo }}/{{ orderInfo.eatNumer }}人</el-col>
			  				<el-col :span="12">
			  					消费金额:&nbsp;
			  					<span style="color: red;">￥{{ orderInfo.totalMoney }}元</span>
			  				</el-col>
			  			</el-row>
			  			<br />
			  			<el-row :gutter="30">
			  				<el-col :span="12">服务员:&nbsp;{{ orderInfo.staffName }}</el-col>
			  				<el-col :span="12">餐台别名:&nbsp;{{ orderInfo.deskAnotherName }}</el-col>
			  			</el-row>
			  			<br />
			  			<div>单号:&nbsp;{{ orderInfo.orderId }}</div>
			  			<br />
			  			<div>开台时间:;&nbsp;{{ orderInfo.openTime }}</div>
			  			<br />
			  			<div>开台备注:&nbsp;{{ orderInfo.openDeskRemark }}</div>

			  		</el-card>
			  		<br />
			  		<el-card shadow="never" style="height: 20rem;overflow: auto;">
			  			<el-table :data="orderInfo.foodVos" style="width: 100%;" @row-click="superRequirement" highlight-current-row="true">
			  				<el-table-column prop="foodName" label="品名">
			  					<template slot-scope="scope">
			  						<div>
			  							<span v-show="scope.row.giveFoodStatus === 1" style="color: red;">[赠{{scope.row.giveNum}}]</span>
			          <span v-show="scope.row.retreatSign === 1" style="color: red;">
			  							[退
			  							<span>{{ scope.row.retreatNum }}</span>
			  							]
			  						</span>
			          <span v-show="scope.row.discount && scope.row.discount !== '10'"
			                style="color: red;">[<span>{{ scope.row.discount }}折</span>]</span>
			  							<span v-show="scope.row.singleFoodSign" style="color: red;">[转]</span>
			  							{{ scope.row.foodName }}
			  						</div>
			  						<div style="color: forestgreen;font-size: 0.5rem;">{{ scope.row.requirementName }}</div>
			  					</template>
			  				</el-table-column>
			  				<el-table-column prop="foodNum" label="数量"></el-table-column>
			  				<el-table-column prop="price" label="金额">
			  					<template slot-scope="scope">
			  						<div style="color: red;">￥{{ Number(scope.row.total) }}元</div>
			  					</template>
			  				</el-table-column>
			  			</el-table>
			  		</el-card>
			  		<el-card shadow="never" v-if="preCheckSign !== null">
			  <el-row>
			    <el-col :span="12">
			      <div v-show="disOrMemMoney !== null">优惠[会员，方案]：<span style="color: green;">￥-{{orderInfo.disOrMemMoney}}</span></div>
			    </el-col>
			    <el-col :span="12">
			      <div v-show="manualOfferMoney !== null">手工优惠：<span style="color: green;">￥-{{orderInfo.manualOfferMoney}}</span></div>
			    </el-col>
			  </el-row>
			  		</el-card>
			  		<br />
			  		<el-card shadow="never">
			  			<el-row :gutter="20">
			  				<el-col :span="6">
			  					<a style="cursor: pointer;text-decoration: none;" @click="openDesk">
			  						<div class="operateCss" >开台</div>
			  					</a>
			  				</el-col>
			  				<el-col :span="6">
			  					<a style="cursor: pointer;text-decoration: none;" @click="orderFood">
			  						<div class="operateCss" >点菜</div>
			  					</a>
			  				</el-col>
			  				<el-col :span="6">
			  					<a style="cursor: pointer;text-decoration: none;" @click="RerndSettlement">
			  						<div class="operateCss" >结账</div>
			  					</a>
			  				</el-col>
			  				<el-col :span="6">
			  					<a style="cursor: pointer;text-decoration: none;" @click="print">
			  						<div class="operateCss" >清单</div>
			  					</a>
			  				</el-col>
			  			</el-row>
			  			<br />
			  			<el-row :gutter="20">
			  				<el-col :span="24">
			  					<el-popover placement="right" width="300" trigger="click">
			  						<div>
			  							<el-row :gutter="20">
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="mergeDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+mergerDeskCss">合并餐台</el-card>
			  									</a>
			  								</el-col>
			  								<el-col :span="12" v-show="splitDeskVisible">
			  									<a style="cursor: pointer;text-decoration: none;" @click="splitDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+splitDeskCss">拆分餐台</el-card>
			  									</a>
			  								</el-col>
			  							</el-row>
			  							<br />
			  							<el-row :gutter="20">
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="clearAllDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+clearDeskCss">清台</el-card>
			  									</a>
			  								</el-col>
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="turnDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+turnDeskCss">转台</el-card>
			  									</a>
			  								</el-col>
			  							</el-row>
			  							<br />
			  							<el-row :gutter="20">
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="copyOrder">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+copyDeskCss">复制多桌</el-card>
			  									</a>
			  								</el-col>
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="consumerToStore">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+consumerToStoreCss">顾客到店</el-card>
			  									</a>
			  								</el-col>
			  							</el-row>
			  							<br />
			  							<el-row :gutter="20">
			  								<el-col :span="12" v-show="lockDeskVisible">
			  									<a style="cursor: pointer;text-decoration: none;" @click="lockDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+lockDeskCss">锁定餐台</el-card>
			  									</a>
			  								</el-col>
			  								<el-col :span="12" v-show="lockDeskVisible">
			  									<a style="cursor: pointer;text-decoration: none;" @click="unLockDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+unLockDeskCss">解除锁定</el-card>
			  									</a>
			  								</el-col>
			  							</el-row>
			  							<br />
			  							<el-row :gutter="20">
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="updateDesk">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+updateDeskCss">编辑开台</el-card>
			  									</a>
			  								</el-col>
			  								<el-col :span="12">
			  									<a style="cursor: pointer;text-decoration: none;" @click="preCheck">
			  										<el-card class="cursor" shadow="always" :style="'text-align: center;'+preCheckCss">预结账</el-card>
			  									</a>
			  								</el-col>
			  							</el-row>
			  						</div>

			  						<a slot="reference" style="cursor: pointer;text-decoration: none;">
			  							<div class="operateCss">更多</div>
			  						</a>
			  					</el-popover>
			  				</el-col>
			  			</el-row>
			  		</el-card>
			  	</div>
			  </el-col>
			</el-drawer>
		</el-row>

		<KeyBoard v-if="KeyBoardVisible" ref="keyBoardInfoRef" @getEatNum="openDeskInfos"></KeyBoard>

		<!-- 支付 -->
		<PayComponent @refreshDataList="getDataList" v-if="PayComponentVisible" ref="PayComponentRef"></PayComponent>

		<SeatCom @refreshDataList="turnDeskBack" v-if="seatComVisile" ref="SeatComRef"></SeatCom>

		<!-- 合并餐桌 -->
		<SeatComDesk @refreshDataList="turnDeskBack" v-if="seatComMergeVisile" ref="SeatComMergeRef"></SeatComDesk>

		<CopyOrder @refreshDataList="getDataList" v-if="copyOrderVisile" ref="copyOrderRef"></CopyOrder>

		<SmallTicket @DataIsNull="toPan" v-show="TicketVisle" ref="TicketRef"></SmallTicket>

		<PreCheck @PreCheck="getDataList" v-show="PreCheckVisible" ref="PreCheckRef"></PreCheck>
	</div>
</template>

<script>
import KeyBoard from './OpenDeskKeyBoard.vue'
import PayComponent from './PayComponent.vue'
import SeatCom from './SeatComponent.vue'
import CopyOrder from '../tangshi/CopyOrder.vue'
import SmallTicket from '../../modules/common/printTemplate/TangShi/FoodItemPrint.vue'
import SeatComDesk from './SeatComMerge.vue'
import PreCheck from './PreCheck.vue'
export default {
  components: {
    KeyBoard,
    PayComponent,
    SeatCom,
    CopyOrder,
    SmallTicket,
    SeatComDesk,
    PreCheck
  },
  data () {
    return {
      deskFormat: null,
      drawer: false,
      PreCheckVisible: false,
      pageIndex: 1,
      pageSize: 10000,
      totalPage: 0,
      seatNum: '0',
      TicketVisle: false,
      dataList: [],
      seatNumList: [],
      lineTableNum: 8,
      regionList: [],
      activeName: '0',
      dinningTableList: [],
      shadow: 'never',
      KeyBoardVisible: false,
      PayComponentVisible: false,
      seatComVisile: false,
      diningTableNo: '',
      eatNumber: '',
      orderNo: '',
      foodList: [],
      dataForm: {
        orderId: '',
        deskId: '',
        peopleNum: '',
        openTime: ''
      },
      openDeskInfo: null,
      orderInfo: '',
      clickCardCss: '',
      foodInfo: null,
      copyOrderVisile: false,
      storeTypeList: [],
      activeStoreType: '0',
      regionId: '0',
      deskStatus: '0',
      seatComMergeVisile: false,
      selectDeskVisle: false,
      mergeDeskID: '',
      openInfo: '',
      lockDeskVisible: true,
      splitDeskVisible: true,
      preCheckSign: null,
      disOrMemMoney: null,
      manualOfferMoney: null,
      lockDeskCss: '',
      unLockDeskCss: '',
      preCheckCss: '',
      updateDeskCss: '',
      consumerToStoreCss: '',
      copyDeskCss: '',
      turnDeskCss: '',
      clearDeskCss: '',
      splitDeskCss: '',
      mergerDeskCss: '',
      deskCss: 'background-color:#C9C9C9',
      pageSign: ''
    }
  },
  created () {
    this.getDataList()
  },
  methods: {
    formatMsgTime (timespan) {
      var dateTime = new Date(timespan) // 将传进来的字符串或者毫秒转为标准时间
      var year = dateTime.getFullYear()
      var month = dateTime.getMonth() + 1
      var day = dateTime.getDate()
      var hour = dateTime.getHours()
      var minute = dateTime.getMinutes()
			// var second = dateTime.getSeconds()
      var millisecond = dateTime.getTime() // 将当前编辑的时间转换为毫秒
      var now = new Date() // 获取本机当前的时间
      var nowNew = now.getTime() // 将本机的时间转换为毫秒
      var milliseconds = 0
      var timeSpanStr
      milliseconds = nowNew - millisecond
      if (milliseconds <= 1000 * 60 * 1) {
				// 小于一分钟展示为刚刚
        timeSpanStr = '刚刚'
      } else if (1000 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60) {
				// 大于一分钟小于一小时展示为分钟
        timeSpanStr = Math.round(milliseconds / (1000 * 60)) + '分'
      } else if (1000 * 60 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24) {
				// 大于一小时小于一天展示为小时
        timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60)) + '时'
      } else if (1000 * 60 * 60 * 24 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24 * 15) {
				// 大于一天小于十五天展示位天
        timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60 * 24)) + '天'
      } else if (milliseconds > 1000 * 60 * 60 * 24 * 15 && year === now.getFullYear()) {
        timeSpanStr = month + '-' + day + ' ' + hour + ':' + minute
      } else {
        timeSpanStr = year + '-' + month + '-' + day + ' ' + hour + ':' + minute
      }
      return timeSpanStr
    },

		// 预结账
    preCheck () {
      if (this.openDeskInfo.status === 5) {
        this.$message.info('此桌台已经预结过')
      }			else if (this.openDeskInfo.status === 1 || this.openDeskInfo.status === 4) {
        this.$message.info('当前餐台没有开台，不能进行预结')
      }			else {
        this.PreCheckVisible = true
        this.orderInfo.openDeskInfo = this.openDeskInfo
        this.$refs.PreCheckRef.init(this.orderInfo)
      }
    },

    consumerToStore () {
      this.$message({
        message: '当前无预定桌',
        type: 'info',
        duration: 1500
      })
    },

		// 编辑餐台
    updateDesk () {
      if (this.openDeskInfo.status === 2) {
        this.KeyBoardVisible = true
        this.orderInfo.isUpdate = 1
        this.$nextTick(() => {
          this.$refs.keyBoardInfoRef.init(this.orderInfo)
        })
      }
      if (this.openDeskInfo.status === 4) {
        this.$message({
          message: '餐台已被锁定，请解锁后再开台',
          type: 'danger',
          duration: 1500
        })
      }
    },

    unLockDesk () {
      if (this.openDeskInfo.status === 4) {
        this.$http({
          url: this.$http.adornUrl('/store/tstorediningtable/lockDesk'),
          method: 'get',
          params: this.$http.adornParams({
            id: this.openDeskInfo.id,
            status: 1
          })
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message({
              message: '解锁餐台成功',
              type: 'success',
              duration: 1500
            })
            this.getDataList()
            this.openDeskInfo = ''
          } else {
            this.$message({
              message: '解锁餐台失败',
              type: 'danger',
              duration: 1500
            })
          }
        })
      } else {
        this.$message({
          message: '当前餐台没有锁定，不能进行解锁',
          type: 'info',
          duration: 1500
        })
      }
    },

    lockDesk () {
      if (this.openDeskInfo.status === 1) {
        this.$http({
          url: this.$http.adornUrl('/store/tstorediningtable/lockDesk'),
          method: 'get',
          params: this.$http.adornParams({
            id: this.openDeskInfo.id,
            status: 4
          })
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message({
              message: '锁定餐台成功',
              type: 'success',
              duration: 1500
            })
            this.getDataList()
            this.openDeskInfo = ''
          } else {
            this.$message({
              message: '锁定餐台失败',
              type: 'danger',
              duration: 1500
            })
          }
        })
      }
    },

		// 合并餐台
    mergeDesk () {
		  if (this.openDeskInfo !== null) {
    this.seatComMergeVisile = true
    this.orderInfo.deskId = this.openDeskInfo.id
    this.orderInfo.storeTypeId = this.activeStoreType
    this.$nextTick(() => {
      this.$refs.SeatComMergeRef.init(this.orderInfo)
    })
  }
    },

		// 拆分餐台
    splitDesk () {
      if (this.openDeskInfo.master === 1 || this.openDeskInfo.slave === 1) {
        this.$http({
          url: this.$http.adornUrl('/reception/tstoreopendesk/splitDesk'),
          method: 'get',
          params: this.$http.adornParams({
            deskId: this.openDeskInfo.id,
            masterId: this.openDeskInfo.masterId
          })
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message({
              message: '拆分餐台成功',
              type: 'success',
              duration: 1500
            })
            this.getDataList()
          } else {
            this.$message({
              message: '拆分餐台失败',
              type: 'warning',
              duration: 1500
            })
          }
        })
      } else {
        this.$message({
          message: '当前餐台没有合并，不能进行拆分',
          type: 'info',
          duration: 1500
        })
      }
    },

    toPan () {
      this.print()
    },

    print () {
      this.orderInfo.eatType = '堂吃'
      this.$nextTick(() => {
        this.$refs.TicketRef.printPdf(this.orderInfo)
      })
    },

    copyOrder () {
		  if (this.openDeskInfo !== null) {
    this.copyOrderVisile = true
    this.orderInfo.storeTypeId = this.activeStoreType
    this.$nextTick(() => {
      this.$refs.copyOrderRef.init(this.orderInfo)
    })
  }
    },

		// 清台
    clearAllDesk () {
      this.$confirm('是否清台?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
				.then(() => {
  this.$http({
    url: this.$http.adornUrl(`/reception/tstoreopendesk/clearAllDesk`),
    method: 'get'
  }).then(({ data }) => {
    if (data && data.code === 0) {
      this.$message({
        message: '清台成功',
        type: 'success',
        duration: 1500
      })
    } else {
      this.$message.error(data.msg)
    }
    this.orderInfo = ''
    this.getDataList()
  })
})
				.catch(() => {
  this.$message({
    type: 'info',
    message: '已取消清台'
  })
})
    },

    turnDeskBack (id) {
      this.$http({
        url: this.$http.adornUrl('/reception/tstoreopendesk/queryOrderInfo/' + id),
        method: 'get'
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.orderInfo = data.openDeskInfo
        } else {
          this.dataList = []
          this.totalPage = 0
        }
      })

      this.getDataList()
    },

		// 转台
    turnDesk () {
      if (this.orderInfo === '') {
        this.$message({
          message: '请选择餐台',
          type: 'warning',
          duration: 1500
        })
      } else {
        this.seatComVisile = true
        this.orderInfo.storeTypeId = this.activeStoreType
        this.orderInfo.master = this.openDeskInfo.master
        this.orderInfo.slave = this.openDeskInfo.slave
        this.orderInfo.masterId = this.openDeskInfo.masterId
        this.orderInfo.money = this.openDeskInfo.money
        this.orderInfo.time = this.openDeskInfo.time
        this.orderInfo.style = this.openDeskInfo.style
        this.orderInfo.status = this.openDeskInfo.status
        this.$nextTick(() => {
          this.$refs.SeatComRef.init(this.orderInfo)
        })
      }
    },

		// 结账
    RerndSettlement () {
      console.log('min  ' + this.openDeskInfo.minConsume)
      if (this.orderInfo.totalMoney < this.openDeskInfo.minConsume) {
        this.$message.info('此区域餐台最低消费金额为【' + this.openDeskInfo.minConsume + '】,请消费满后再结账')
      }			else if (this.orderInfo === '') {
        this.$message({
          message: '请选择结账餐台',
          type: 'warning',
          duration: 1500
        })
      } else if (this.orderInfo.foodVos.length === 0) {
        this.$message({
          message: '此餐台没有点单，不能进行结账',
          type: 'warning',
          duration: 1500
        })
      } else {
        this.PayComponentVisible = true
        this.orderInfo.openDeskInfo = this.openDeskInfo
        this.$nextTick(() => {
          this.$refs.PayComponentRef.init(this.orderInfo)
        })
      }
    },

		// 退菜
    retreatFood () {
      if (this.foodInfo === null) {
        this.$message({
          message: '请选择需要退菜的菜品',
          type: 'warning',
          duration: 1500
        })
      } else {
        for (let i = 0; i < this.orderInfo.foodVos.length; i++) {
          if (this.orderInfo.foodVos[i].id === this.foodInfo.id) {
						// 多份
            if (this.orderInfo.foodVos[i].foodNum > 1) {
              this.orderInfo.totalMoney -= this.orderInfo.foodVos[i].price
              this.orderInfo.foodVos[i].foodNum--
            } else {
              this.orderInfo.totalMoney -= this.orderInfo.foodVos[i].price
              this.orderInfo.foodVos.splice(i, 1)
            }
          }
        }
				// 更新数据
        this.$http({
          url: this.$http.adornUrl(`/reception/tstoreopendesk/xiadan`),
          method: 'post',
          data: this.$http.adornData({
            orderInfo: this.orderInfo
          })
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message({
              message: '退菜成功',
              type: 'success',
              duration: 1500
            })
          } else {
            this.$message.error(data.msg)
          }
        })
      }
    },

    superRequirement (row, column, event) {
      this.foodInfo = row
    },

		// 加菜
    orderFood () {
      if (this.openDeskInfo === null) {
        this.$message({
          message: '请选择餐台',
          type: 'warning',
          duration: 1500
        })
      }
      if (this.openDeskInfo.status === 2 || this.openDeskInfo.status === 5) {
        this.openDeskInfo.sign = 2
        this.openDeskInfo.storeTypeId = this.activeStoreType
        sessionStorage.setItem('openDeskInfo', JSON.stringify(this.openDeskInfo))
        this.$router.push({ name: 'DianCan', params: this.openDeskInfo })
      }
    },

		// 用餐信息
    openDeskInfos (info) {
      this.eatNumer = info.eatNumer
      this.openInfo = info
      console.log('openInfo  ' + JSON.stringify(this.openDeskInfo))
			// 修改餐台
      if (info.isUpdate === 1) {
        this.$http({
          url: this.$http.adornUrl(`/reception/tstoreopendesk/updateDesk`),
          method: 'post',
          data: this.$http.adornData({
            deskId: this.diningTableId,
            peopleNum: this.eatNumer,
            openDeskRemark: info.openDeskRemark,
            staffName: info.staffName,
            deskAnotherName: info.deskAnotherName
          })
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message({
              message: '编辑餐台成功',
              type: 'success',
              duration: 1500
            })
          } else {
            this.$message.error(data.msg)
          }
          this.getDataList()
        })
      }
			// 下单
      else {
				// 开台
        if (info.sign === 1) {
          this.$http({
            url: this.$http.adornUrl(`/reception/tstoreopendesk/save`),
            method: 'post',
            data: this.$http.adornData({
              deskId: this.diningTableId,
              peopleNum: this.eatNumer,
              openDeskRemark: info.openDeskRemark,
              staffName: info.staffName,
              deskAnotherName: info.deskAnotherName
            })
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.$message({
                message: '开台成功',
                type: 'success',
                duration: 1500
              })
              window.speechSynthesis.speak(new window.SpeechSynthesisUtterance(this.openDeskInfo.diningTableNo + '桌开台成功，请进行点菜'))
              this.openDeskInfo.orderId = data.openDeskInfo.orderId
              this.openDeskInfo.openTime = data.openDeskInfo.openTime
              this.openDeskInfo.eatNumer = data.openDeskInfo.peopleNum
              this.openDeskInfo.sign = 1
              sessionStorage.setItem('openDeskInfo', JSON.stringify(this.openDeskInfo))
            } else {
              this.$message.error(data.msg)
            }
            this.getDataList()
          })
        }
				// 开台并点单
        else {
          this.$http({
            url: this.$http.adornUrl(`/reception/tstoreopendesk/save`),
            method: 'post',
            data: this.$http.adornData({
              deskId: this.diningTableId,
              peopleNum: this.eatNumer,
              openDeskRemark: info.openDeskRemark,
              staffName: info.staffName,
              deskAnotherName: info.deskAnotherName
            })
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.$message({
                message: '开台成功',
                type: 'success',
                duration: 1500
              })
              this.openDeskInfo.orderId = data.openDeskInfo.orderId
              this.openDeskInfo.openTime = data.openDeskInfo.openTime
              this.openDeskInfo.eatNumer = data.openDeskInfo.peopleNum
              this.openDeskInfo.sign = 1
              sessionStorage.setItem('openDeskInfo', JSON.stringify(this.openDeskInfo))
              this.$router.push({ name: 'DianCan' })
            } else {
              this.$message.error(data.msg)
            }
          })
        }
      }
    },

    openDesk () {
      if (this.openDeskInfo.status === 1) {
        console.log('open  ' + JSON.stringify(this.openDeskInfo))
        this.KeyBoardVisible = true
        const order = {
          isUpdate: 2,
          deskId: this.diningTableId,
          eatNumer: this.openDeskInfo.seatNum,
          openDeskRemark: '',
          staffName: '',
          deskAnotherName: ''
        }
        this.$nextTick(() => {
          this.$refs.keyBoardInfoRef.init(order)
        })
      }
      if (this.openDeskInfo.status === 4) {
        this.$message({
          message: '餐台已被锁定，请解锁后再开台',
          type: 'danger',
          duration: 1500
        })
      }
    },

    dbClickEvent (item) {
		  if (item.status === 1) {
    this.KeyBoardVisible = true
    const order = {
      isUpdate: 2,
      deskId: this.diningTableId,
      eatNumer: item.seatNum,
      openDeskRemark: '',
      staffName: '',
      deskAnotherName: ''
    }
    this.$nextTick(() => {
      this.$refs.keyBoardInfoRef.init(order)
    })
  }
      if (this.openDeskInfo.status === 2 || this.openDeskInfo.status === 5) {
        this.openDeskInfo.sign = 2
        this.openDeskInfo.storeTypeId = this.activeStoreType
        sessionStorage.setItem('openDeskInfo', JSON.stringify(this.openDeskInfo))
        this.$router.push({ name: 'DianCan', params: this.openDeskInfo })
      }
    },

		// 选择餐台
    selectDiningTable (item) {
      this.openDeskInfo = item
      if (item.status === 1 || item.status === 4) {
			  this.preCheckSign = null
        this.lockDeskCss = ''
        this.unLockDeskCss = ''
        this.mergerDeskCss = this.deskCss
        this.splitDeskCss = this.deskCss
        this.updateDeskCss = this.deskCss
        this.preCheckCss = this.deskCss
        this.turnDeskCss = this.deskCss
        this.copyDeskCss = this.deskCss
        if (item.status === 4) {
          this.lockDeskCss = this.deskCss
        } else {
          this.unLockDeskCss = this.deskCss
        }
        const arr = []
        for (let i = 0; i < this.dinningTableList.length; i++) {
          if (this.dinningTableList[i].id === item.id) {
            this.dinningTableList[i].selectDeskId = 1
            arr.push(this.dinningTableList[i])
          } else {
            this.dinningTableList[i].selectDeskId = 2
            arr.push(this.dinningTableList[i])
          }
        }
        this.dinningTableList = arr
        this.orderInfo = ''
      }
      if (item.status === 2 || item.status === 5) {
        this.lockDeskCss = this.deskCss
        this.unLockDeskCss = this.deskCss
        this.turnDeskCss = ''
        this.copyDeskCss = ''
        this.updateDeskCss = ''
        this.preCheckCss = ''
        this.mergeDeskID = item.id
        if (item.master === 0 && item.slave === 0) {
          this.splitDeskCss = this.deskCss
          this.mergerDeskCss = ''
        } else {
          this.splitDeskCss = ''
          this.mergerDeskCss = ''
        }
        for (let i = 0; i < this.dinningTableList.length; i++) {
          this.dinningTableList[i].selectDeskId = 2
        }
        for (let i = 0; i < this.dinningTableList.length; i++) {
          if (this.dinningTableList[i].id === item.id) {
            this.dinningTableList[i].selectDeskId = 1
          }
          if (this.dinningTableList[i].master === 1 || this.dinningTableList[i].slave === 1) {
            this.dinningTableList[i].mergeDeskId = 1
          }
        }
        this.$http({
          url: this.$http.adornUrl('/reception/tstoreopendesk/queryOrderInfo/' + item.id),
          method: 'get'
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.orderInfo = data.openDeskInfo
            this.preCheckSign = data.openDeskInfo.preCheckSign
            this.disOrMemMoney = data.openDeskInfo.disOrMemMoney
            this.manualOfferMoney = data.openDeskInfo.manualOfferMoney
          } else {
            this.dataList = []
            this.totalPage = 0
          }
        })
      }
      if (item.status === 3) {
        this.$confirm('是否清台?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
					.then(() => {
  this.$http({
    url: this.$http.adornUrl(`/reception/tstoreopendesk/clearDesk/` + this.openDeskInfo.id),
    method: 'get'
  }).then(({ data }) => {
    if (data && data.code === 0) {
      this.$message({
        message: '清台成功',
        type: 'success',
        duration: 1500
      })
    } else {
      this.$message.error(data.msg)
    }
    this.orderInfo = ''
    this.getDataList()
  })
})
					.catch(() => {
  this.$message({
    type: 'info',
    message: '已取消清台'
  })
})
      }
      this.diningTableNo = item.diningTableNo
      this.diningTableId = item.id
    },

    querySeatById (tab, event) {
		  this.openDeskInfo = null
      if (this.pageIndex > 1) {
        this.pageIndex = 1
      }
      if (tab === 'noClick') {
      } else {
        this.regionId = tab.name
      }
      this.$http({
        url: this.$http.adornUrl('/store/tstorediningtable/querySeatById'),
        method: 'get',
        params: this.$http.adornParams({
          status: this.deskStatus,
          storeTypeId: this.activeStoreType,
          seatNum: this.seatNum,
          regionId: this.regionId,
          page: this.pageIndex,
          limit: this.pageSize
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.dinningTableList = data.data.dinningTableList.records
          this.seatNumList = data.data.seatNumList
          this.totalPage = data.data.dinningTableList.total
        } else {
          this.dataList = []
          this.totalPage = 0
        }
      })
    },

    querySeatByStoreTypeId (tab, event) {
		  this.openDeskInfo = null
      if (this.pageIndex > 1) {
        this.pageIndex = 1
      }
      this.$http({
        url: this.$http.adornUrl('/store/tstorediningtable/querySeatById'),
        method: 'get',
        params: this.$http.adornParams({
          status: this.deskStatus,
          storeTypeId: this.activeStoreType,
          seatNum: this.seatNum,
          regionId: this.regionId,
          page: this.pageIndex,
          limit: this.pageSize
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.dataList = data.data
          this.seatNumList = data.data.seatNumList
          this.regionList = data.data.regionList
          this.dinningTableList = data.data.dinningTableList.records
          this.totalPage = data.data.dinningTableList.total
        } else {
          this.dataList = []
          this.totalPage = 0
        }
      })
    },

		// 当前页
    currentChangeHandle (val) {
      this.pageIndex = val
      this.pageSign = 1
      this.getDataList()
    },

		// 每页数
    sizeChangeHandle (val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },

    getDataList () {
		  this.openDeskInfo = null
      this.orderInfo = {}
			// 餐厅类型
      this.$http({
        url: this.$http.adornUrl('/store/tstoretype/list'),
        method: 'get'
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.storeTypeList = data.page.list
          if (this.pageSign !== 1) {
            this.activeStoreType = data.page.list[0].id
          }
          this.$http({
            url: this.$http.adornUrl('/store/tstorediningtable/listSeat'),
            method: 'get',
            params: this.$http.adornParams({
              status: 0,
              storeTypeId: this.activeStoreType,
              regionId: 0,
              seatNum: 0,
              page: this.pageIndex,
              limit: this.pageSize
            })
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.dataList = data.data
              this.seatNumList = data.data.seatNumList
              this.lineTableNum = 24 / data.data.deskFormat.lineTableNum
              this.deskFormat = data.data.deskFormat
              this.regionList = data.data.regionList
              this.dinningTableList = data.data.dinningTableList.records
              this.totalPage = data.data.dinningTableList.total
            } else {
              this.dataList = []
              this.totalPage = 0
            }
          })
        } else {
          this.storeTypeList = []
        }
      })
    }
  }
}
</script>

<style>
.tableName {
	display: -moz-box; /*兼容Firefox*/
	display: -webkit-box; /*兼容FSafari、Chrome*/

	-moz-box-align: center; /*兼容Firefox*/
	-webkit-box-align: center; /*兼容FSafari、Chrome */

	-moz-box-pack: center; /*兼容Firefox*/
	-webkit-box-pack: center; /*兼容FSafari、Chrome */

	font-size: 18px;
	font-weight: 3000;
}
.operateCss {
	text-align: center;
	width: 100%;
	height: 50px;
	padding-top: 18px;
	color: black;
	border: 1px solid lightgray;
}
.seatNum {
	text-align: center;
}
.seatNum1 {
	text-align: center;
}
.operateCss:hover{
	background-color: skyblue;
}
.footer {
	height: 100px;

	width: 100%;

	background-color: #ddd;

	position: fixed;

	bottom: 0;
}
.cursor {
	cursor: pointer;
	text-decoration: none;
}

.divCss {
	height: 100%;
}
</style>
